<template>
	<view>
		<view class="page">
			<view class="top" :style="`padding-top:` + $store.state.StatusBar.statusBar + `px`">
				<view class="top-icon" @click="back">
					<u-icon name="arrow-left" size="42rpx" color='#fff'></u-icon>
				</view>
				<view class="top-title c-fff">{{ title }}</view>
			</view>
			<view class="body" :style="`margin-top:` + $store.state.StatusBar.statusBar + `px`">

				<view class="list">
					<view class="flex_r fa_c item" v-for="(item, index) in list">
						<view style="position:absolute; left:20rpx; top:20rpx; font-size:24rpx;" class="c-fff">{{ item.neirong }}</view>
						<view style="position:absolute; left:20rpx; bottom:10rpx; font-size:24rpx;" class="c-fff">{{ item.qianshu }}</view>
						<view style="position:absolute; right:80rpx; top:30rpx; color: #fff; font-size: 26rpx;">
							{{ item.time }}</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
import { to } from '@/utils/index.js';
export default {
	data() {
		return {
			title: '',
			pageno: 1,
			list: []
		}
	},
	onReachBottom() {
		this.getList()
	},
	onLoad(option) {
	},
	onShow(option) {
		this.pageno = 1;
		this.list = [];
		this.getList();
		this.title = '魅力值明细'
	},
	methods: {
		to,
		back() {
			to()
		},
		async getList() {
			let res = await this.$c.post("/app/mingxi/meililist?pageno=" + this.pageno)
			if (res.code != 0) {
				uni.navigateTo({
					url: '/im/login/login'
				});
			}
			this.list = this.list.concat(res.data)
			this.pageno++;
		}
	}
}
</script>

<style scoped lang="scss">
.page {
	width: 100vw;
	height: 100vh;
	/* background: linear-gradient(#e3ecfb, #fdedf0, #fff, #fff); */
}

.top {
	position: fixed;
	top: 0rpx;
	width: 100%;
	/* background-color: #e3ecfb; */
	z-index: 999;
	text-align: center;
	vertical-align: middle;
	padding: 10rpx;
}

.top-icon {
	position: absolute;
	left: 30rpx;
	z-index: 99;
	width: 30rpx;
	height: 30rpx;
}

.top-title {
	line-height: 50rpx;
	display: block;
	height: 50rpx;
	z-index: 99;
}

.body {
	padding-top: 40rpx;
}

.list {
	padding: 20rpx;
	padding-left: 2%;
	padding-right: 2%;
	transform: translateX(-2%);
}

.item {
	width: 100vw;
	height: 60rpx;
	padding: 10px;
	position: relative;
	// background-color: #e3ecfb;
	// border-radius: 20rpx;
	border-bottom: 1px solid #c5cecb;
}</style>